<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title>热门活动</title>
        <style type="text/css">
            *{
                margin:0;
                padding:0;
            }
            body{
                width:660px;
                margin:0 auto;
            }
            .more{
                float:right;
            }

            li{
                float:left;
                left: ;ist-style: none;
                margin:20px 20px 0px 20px;
                font-size: 14px;
            }
            li:hover{
                box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1), 0 0 10px 0 rgba(0,0,0,0.2);
            }
        </style>
    </head>
    <body>
        <h3 class="more">更多</h3>
        <h3 class="hot">热门活动</h3>
        <ul>
            <li class="activity">
                <img src="images/img1.png"/>
                <p>推荐活动 | 原创音乐现金榜T榜</p>
            </li>
            <li class="program">
                <img src="images/img2.png"/>
                <p>推荐节目|《TAImusic》爆笑来袭</p>
            </li>
            <li class="song">
                <img src="images/img3.png"/>
                <p>推荐歌单 | 继续宠爱张国荣</p>
            </li>
            <li class="music">
                <img src="images/img4.png"/>
                <p>推荐音乐| 330金属音乐巡演 成都小酒馆音乐空间</p>
            </li>
        </ul>
    </body>
</html>
